//获取任意元素的任意样式的方法函数
function getStyle(ele, sty) {
    //var sty = 
    //假设获取div的宽度
    //元素.currentStyle==undefined  证明在标准浏览器中
    if (ele.currentStyle == undefined) {
        return getComputedStyle(ele)[sty];
    } else {
        return ele.currentStyle[sty];
    }
    //分析不确定的数据 提取为形参 元素 样式
    //将形参带入到函数主体代码中
}

//动画函数 可以实现大部分样式的动画效果 不能实现透明度、颜色等样式的动画
var timer;
function move(ele, sty, end, step) {
    //防止定时器的叠加
    clearInterval(timer);
    //2.编写主要代码 以正向运动为例
    //2.1三要素
    var start = parseInt(getStyle(ele, sty));//1000 0

    //2.2设置定时器
    timer = setInterval(function () {
        //2.3编写走一步的代码
        start += step;//990
        if (step > 0 && start >= end || step < 0 && start <= end) {//990>=0
            clearInterval(timer);
            start = end;//为了保证精确到达终点
        }
        ele.style[sty] = start + 'px';
    }, 24)
    //经过分析 发现 上述代码中 元素、样式、起点、终点、步长不确定
    //起点不需要提取为参数 因为起点是动态获取的
}

//求任意范围随机数的函数
function getRan(down, up) {
    //以求100-300随机数为例
    var ran = parseInt(Math.random() * (up - down + 1)) + down
    return ran;
    //分析不确定的数据 上限 和 下限 提取为形参
    //带入
}
//获取最后一个子元素
function getLast(node) {
    if (node.lastElementChild == undefined) {
        //在ie低版本中
        return node.lastChild;
    } else {
        //在标准浏览器中
        return node.lastElementChild;
    }
}
//获取第一个子元素
function getFirst(node) {
    //获取node节点的第一个子节点
    if (node.firstElementChild == undefined) {
        //当前处于ie低版本中
        return node.firstChild;
    } else {
        //处于标准浏览器中
        return node.firstElementChild;
    }
}
//获取下一个兄弟
function getNext(node) {
    //要获取node节点的下一个兄弟元素
    if (node.nextElementSibling == undefined) {
        //证明在ie浏览器中
        return node.nextSibling;
    } else {
        //在标准浏览器中
        return node.nextElementSibling;
    }
}
//获取上一个兄弟
function getPrev(node) {
    //获取当前node节点的上一个兄弟元素
    if (node.previousElementSibling == undefined) {
        //证明当前正处于 ie低版本浏览器中
        return node.previousSibling;
    } else {
        //证明不在ie低版本浏览器中
        return node.previousElementSibling
    }
}

//封装一个兼容函数 可以在任意浏览器中 给任意元素 添加任意事件名和处理函数的 事件
function bind(ele, type, fn) {
    //以 给div 绑定点击事件为例
    if (ele.attachEvent == undefined) {
        ele.addEventListener(type, fn)
    } else {
        //不再标准浏览器中
        ele.attachEvent("on" + type, fn)
    }
    //分析不确定的值 并提取为参数 元素 事件名 处理函数
}

//封装一个 可以在 任意浏览器中 解绑 任意元素的 任意事件名 和 处理函数的事件
function unBind(ele, type, fn) {
    if (ele.detachEvent == undefined) {
        ele.removeEventListener(type, fn);
    } else {
        ele.detachEvent("on" + type, fn)
    }
    //不确定的值 元素 事件名 处理函数
}